<template>
  <div class="app-container">
    <!-- 添加或修改设备对话框 -->
    <el-dialog
      :close-on-click-modal="false"
      title="添加班组"
      :visible.sync="show"
      @on-cancel="show = false"
      width="400px"
      @open="onOpen"
      append-to-body
    >
      <el-form :inline="true" label-width="108px">
        <el-form-item label="班组">
          <el-select
            v-model="teamValue"
            placeholder="请选择班组"
            clearable
            size="small"
          >
            <el-option
              v-for="team in teamList"
              :key="team.workTeamId"
              :label="team.workTeamName"
              :value="team.workTeamId"
            />
          </el-select>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submit">提 交</el-button>

        <el-button @click="show = false">取 消</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import { getTeamCombo } from "@/api/task/team";

export default {
  name: "teamDialog",
  props: {
    visible: {
      type: Boolean,
      default: function () {
        return false;
      },
    },

    teamType: {
      type: String,
      default: function () {
        return "table";
      },
    },
  },
  data() {
    return {
      // 班组数据
      teamList: [],
      teamValue: "",
    };
  },
  computed: {
    show: {
      get() {
        return this.visible;
      },
      set(val) {
        this.$emit("update:visible", val);
      },
    },
    deptId() {
      return this.$store.getters.choosedDeptId;
    },
  },

  created() {},
  methods: {
    getList() {
      this.loading = true;
      getTeamCombo({ workTeamType: "person", deptId: this.deptId }).then(
        (response) => {
          this.teamList = response.data;
          this.loading = false;
        }
      );
    },

    submit() {
      this.$emit(
        this.teamType == "table" ? "changeTableTeam" : "changeFormTeam",
        this.teamList.find((v) => v.workTeamId == this.teamValue)
      );
      this.show = false;
    },
    onOpen() {
      this.getList();
    },
  },
};
</script>
